import React, { Component } from 'react';
import { Tabs } from 'antd-mobile';

const tabs = [
  { title: '男装' },
  { title: '女装' },
  { title: '鞋履' },
  { title: '箱包' },
  { title: '配饰' },
];

class Kindtab extends Component {
	render () {
		return (
		  <div className="main-tab" >			
			<Tabs tabs={tabs}
			  initalPage={'t2'}
			  tabBarPosition="left"
			  tabDirection="vertical"
			>
			  <div className="tab-main">
				<dl className="tab-dl">
					<dt className="tab-dt">
						<a href="http://localhost:3000/#/men">
							<img src="http://img.banggo.com/sources/cms/banggo2017/APP/app_180906fly_01.jpg" alt="banner" />
						</a>
					</dt>
					<dd className="tab-dd">
						<p>上装</p>
						<ul>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/661529/661529_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="长袖T恤" />
									<span>长袖T恤</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/661545/661545_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="衬衫" />
									<span>衬衫</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/661543/661543_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="卫衣" />
									<span>卫衣</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/716162/716162_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="毛衣" />
									<span>毛衣</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/734244/734244_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="夹克" />
									<span>夹克</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MC/514368/514368_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="西服" />
									<span>西服</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MC/530442/530442_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="风衣" />
									<span>风衣</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/239425/239425_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="大衣" />
									<span>大衣</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/231398/231398_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="棉服" />
									<span>棉服</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/601887/601887_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="羽绒服" />
									<span>羽绒服</span>
								</a>
							</li>
						</ul>
					</dd>
					<dd className="tab-dd">
						<p>下装</p>
						<ul>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/756491/756491_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="牛仔长裤" />
									<span>牛仔长裤</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/748293/748293_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="休闲长裤" />
									<span>休闲长裤</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MB/749158/749158_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="针织休闲裤" />
									<span>针织休闲裤</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/men">
									<img src="http://pic.banggo.com/sources/images/goods/MC/550265/550265_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="西裤" />
									<span>西裤</span>
								</a>
							</li>
						</ul>
					</dd>
				</dl>
			  </div>
			  <div className="tab-main">
				<dl className="tab-dl">
					<dt className="tab-dt">
						<a href="http://localhost:3000/#/women">
							<img src="http://img.banggo.com/sources/cms/banggo2017/APP/app_180906fly_02.jpg" alt="banner" />
						</a>
					</dt>
					<dd className="tab-dd">
						<p>上装</p>
						<ul>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/205856/205856_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="www.baidu.com" />
									<span>长袖T恤</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/722649/722649_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="www.baidu.com" />
									<span>衬衫</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/224832/224832_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="卫衣" />
									<span>卫衣</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/716697/716697_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="毛衣" />
									<span>毛衣</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/734864/734864_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="夹克" />
									<span>夹克</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MC/534653/534653_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="风衣" />
									<span>风衣</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/739501/739501_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="大衣" />
									<span>大衣</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/231812/231812_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="棉服" />
									<span>棉服</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/738619/738619_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="羽绒服" />
									<span>羽绒服</span>
								</a>
							</li>
						</ul>
					</dd>
					<dd className="tab-dd">
						<p>下装</p>
						<ul>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MC/548978/548978_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="休闲长裤" />
									<span>休闲长裤</span>
								</a>
							</li>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/749586/749586_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="针织裤" />
									<span>针织裤</span>
								</a>
							</li>
						</ul>
					</dd>
					<dd className="tab-dd">
						<p>裙装</p>
						<ul>
							<li>
								<a href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/758216/758216_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="半身裙" />
									<span>半身裙</span>
								</a>
							</li>
							<li>
								<a  href="http://localhost:3000/#/women">
									<img src="http://pic.banggo.com/sources/images/goods/MB/241492/241492_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="连衣裙" />
									<span>连衣裙</span>
								</a>
							</li>
						</ul>
					</dd>
				</dl>
			  </div>
			  <div className="tab-main">
				<dl className="tab-dl">
					<dt className="tab-dt">
						<a href="www.baidu.com">
							<img src="http://img.banggo.com/sources/cms/banggo2017/APP/app_180906fly_04.jpg" alt="鞋履" />
						</a>
					</dt>
					<dd className="tab-dd">
						<p>男鞋</p>
						<ul>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/seller/goods/image/5200543/A57458/A57458_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="休闲鞋" />
									<span>休闲鞋</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/202484/202484_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="运动鞋" />
									<span>运动鞋</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/271486/271486_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="商务鞋" />
									<span>商务鞋</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/seller/goods/image/5200543/A57450/A57450_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="帆布鞋" />
									<span>帆布鞋</span>
								</a>
							</li>
						</ul>
					</dd>
					<dd className="tab-dd">
						<p>女鞋</p>
						<ul>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/seller/goods/image/5200497/A52855/A52855_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="休闲鞋" />
									<span>休闲鞋</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/202696/202696_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="运动鞋" />
									<span>运动鞋</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/201660/201660_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="商务鞋" />
									<span>商务鞋</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MC/569615/569615_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="帆布鞋" />
									<span>帆布鞋</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MC/569789/569789_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="靴子" />
									<span>靴子</span>
								</a>
							</li>
						</ul>
					</dd>
				</dl>
			  </div>
			  <div className="tab-main">
				<dl className="tab-dl">
					<dt className="tab-dt">
						<a href="www.baidu.com">
							<img src="http://img.banggo.com/sources/cms/banggo2017/APP/20180321/app_fl6.jpg" alt="箱包" />
						</a>
					</dt>
					<dd className="tab-dd">
						<p>品质男包</p>
						<ul>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MC/583033/583033_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="钱包/手拿包" />
									<span>钱包/手拿包</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/784065/784065_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="胸包" />
									<span>胸包</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MC/583071/583071_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="双肩包" />
									<span>双肩包</span>
								</a>
							</li>
						</ul>
					</dd>
					<dd className="tab-dd">
						<p>潮流女包</p>
						<ul>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MC/583642/583642_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="单肩包" />
									<span>单肩包</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/784739/784739_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="双肩包" />
									<span>双肩包</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/784892/784892_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="斜挎包" />
									<span>斜挎包</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MC/583608/583608_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="钱包/手拿包" />
									<span>钱包/手拿包</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MC/583597/583597_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="手提包" />
									<span>手提包</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/784896/784896_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="胸包/腰包" />
									<span>胸包/腰包</span>
								</a>
							</li>
						</ul>
					</dd>
				</dl>
			  </div>
			  <div className="tab-main">
				<dl className="tab-dl">
					<dt className="tab-dt">
						<a href="www.baidu.com">
							<img src="http://img.banggo.com/sources/cms/banggo2017/APP/20180321/app_fl7.jpg" alt="配饰" />
						</a>
					</dt>
					<dd className="tab-dd">
						<p>配饰</p>
						<ul>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/775099/775099_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="帽子" />
									<span>帽子</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/776531/776531_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="围巾/披肩" />
									<span>围巾/披肩</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MB/232260/232260_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="腰带/皮带" />
									<span>腰带/皮带</span>
								</a>
							</li>
							<li>
								<a href="www.baidu.com">
									<img src="http://pic.banggo.com/sources/images/goods/MC/579689/579689_00.jpg?x-oss-process=image/resize,m_pad,w_160,h_160" alt="其他配饰" />
									<span>其他配饰</span>
								</a>
							</li>
						</ul>
					</dd>
				</dl>
			  </div>
			</Tabs>
			
		  </div>
		)
	}
}

export default Kindtab;